<template>
  <div style="container" class="relative">
    <van-nav-bar title="开店申请资料填写"  />

    <div class="inner">
      <van-form @submit="onSubmit">
        <van-cell-group>
          <van-field
            v-model="name"
            label="申请人姓名"
            placeholder="如：张三"
            required
            :rules="[{ validator:validator, message: '请输入真实姓名' }]"
          />
        </van-cell-group>
        <van-cell-group>
          <van-field
            v-model="tel"
            type="tel"
            label="手机号"
            maxlength="11"
            required
            :rules="[{ validator:validator2, message: '请输入正确的手机号码' }]"
          />
        </van-cell-group>
        <van-button round block type="info" native-type="submit">提交</van-button>
      </van-form>
    </div>
  </div>
</template>

<script>
export default {
  name: "Invite",
  data() {
    return {
      name: "",
      tel: "",
      InviteStore: "aaaaaaaaaaaa",
    };
  },
  methods: {
    // onClickLeft() {
    //   this.$router.go(-1);
    // },
    // 提交资料
    onSubmit() {
      let data = {
        InviteStore: this.InviteStore,
        name: this.name,
        phone: this.tel
      };
  
      this.$ajax.post({ url: 'App/ownerst/storeapply', data }).then(res => {
        console.log("", res.message);
        if (res.message === "二维码已失效") {
          this.$toast(res.message);
        } else if (res.message === "申请成功，请耐心等待审核") {
          this.$toast(res.message);
        }
      });
      console.log("submit");
    },
    validator(name) {
      if (name) {
        // 匹配2~4个汉字
        return /^[\u4E00-\u9FA5]{2,4}$/.test(name);
      }
    },
    validator2(tel) {
      if (tel) {
        // 匹配手机号
        return /^1([38][0-9]|4[579]|5[0-3,5-9]|6[6]|7[0135678]|9[89])\d{8}$/.test(
          tel
        );
      }
    }
  },
  mounted() {
    this.InviteStore = this.$route.query.InviteStore;
    console.log("InviteStore", this.InviteStore);
  }
};
</script>

<style lang="scss" scoped>
.inner {
  width: 80%;
  position: absolute;
  left: 50%;
  top: 200px;
  transform: translateX(-50%);
}
</style>